<template>
  <div>
    <TopFilter ref="formpanel" :list="formList" :cols="3" :rows="1" labelWidth="75" :collapse="false" @filterChange="changeHandle"></TopFilter>

    <FilterTable
      ref="table"
      :columns="columns"
      :isColumnFilter="false"
      columnsRef="partPartOtherPartCirculateHandleLastOrderNoList"
      :isToperInfo="false"
      :params="fetchParams"
      selectionType="single"
      :datakey="'rows'"
      height="180px"
      :onSyncTableData="changetablelist"
      :onRowSelectChange="selectChangeHandle"
      :onColumnsChange="columns => (this.columns = columns)"
    >
      <!-- :fetchapi="fetchApi" -->
    </FilterTable>
    <div
      :style="{
        position: 'absolute',
        left: 0,
        bottom: 0,
        right: 0,
        zIndex: 9,
        borderTop: '1px solid #e9e9e9',
        padding: '10px 20px',
        background: '#fff',
        textAlign: 'right'
      }"
    >
      <el-button type="primary" @click="submit">确定</el-button>
      <el-button @click="closeDialog">取消</el-button>
    </div>
  </div>
</template>
<script>
// import { searchRoList } from '@/api/repair/quaback';
import { dictionary } from '@/utils/dictMixin';
export default {
  mixins: [dictionary],
  data() {
    return {
      formList: this.createFrom(),
      columns: this.createTableColumns(),
      // fetchApi: searchRoList,
      fetchParams: {},
      selectRow: []
    };
  },
  methods: {
    createFrom() {
      return [
        {
          type: 'INPUT',
          label: '单据编号',
          fieldName: 'orderNo'
        },
        {
          type: 'INPUT',
          label: '配件代码',
          fieldName: 'partNo'
        },
        {
          type: 'INPUT',
          label: '配件名称',
          fieldName: 'partName'
        },
        {
          type: 'INPUT',
          label: '主组号',
          fieldName: 'license'
        }
      ];
    },
    createTableColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 70,
          fixed: 'left',
          align: 'center',
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '单据编号',
          width: 120,
          showOverflowTooltip: true,
          dataIndex: 'orderNo',
          sorter: true,
          filter: true
        },
        {
          title: '对方单位名称',
          width: 150,
          showOverflowTooltip: true,
          dataIndex: 'companyName',
          sorter: true,
          filter: true
        },
        {
          title: '借还日期',
          dataIndex: 'inOutDate',
          sorter: true,
          filter: true
        },
        {
          title: '仓库代码',
          dataIndex: 'storageNo',
          sorter: true,
          filter: true
        },
        {
          title: '仓库名称',
          dataIndex: 'storageName',
          sorter: true,
          filter: true
          // hidden: true
        }
        // {
        //   render: props => {
        //     const pyt = pinyin(props.row.labourName, { style: 4 })
        //       .join('')
        //       .toUpperCase();
        //     return <span>{pyt}</span>;
        //   }
        // }
      ];
    },

    changeHandle(val) {
      this.fetchParams = Object.assign({}, val);
    },

    changetablelist() {},
    selectChangeHandle(val) {
      console.log('val', val);
      this.selectRow = val;
    },

    formchangeFun() {},

    submit() {
      if (this.selectRow.length < 1) {
        this.$notify.error({ title: '提示信息', message: '请选择数据' });
      } else {
        this.$emit('close', 'submit', this.selectRow[0]);
      }
    },
    closeDialog() {
      this.$emit('close', 'close');
    }
  }
};
</script>
<style lang="less" scoped></style>
